	<div id="campo_conteudo">
    	<div id="titulo_pagina">
    		Especialidades M&eacute;dicas 
    		<a href="<?= base_url(); ?>home">
    			<img src="<?= base_url(); ?>images/bt_voltar.png" style="float:right; margin:3px 0 0 0;" /></a>
    	</div>
		<h3 style="line-height:10px">
			Manuten&ccedil;&atilde;o das Especialidades M&eacute;dicas
		</h3>
			<script type="text/javascript">
				var arr_fields = [
				                  {nome:'id',label:'Id', tp_obj: 'hid', tipo : 'int', grid:{name:'id',index:'id', width:15, def_order:true,order:'asc'}},
				                  {nome:'descricao',label:'Descri&ccedil;&atilde;o', tp_obj: 'txt', tipo : 'str', grid:{name:'descricao',index:'descricao', width:170, def_order:false,order:''}},
				                  {nome:'flag_ativo',label:'Especialidade Ativa?', tp_obj: 'sel', tipo : 'str', grid:{name:'flag_ativo',index:'flag_ativo', width:60, def_order:false,order:'', formatter:format_flag}},
				                  {nome:'hid_oper',label:'', tp_obj: 'hid', tipo : 'str', grid:null}
					              	];
				var editValue = null;
				$(document).ready(function(){
					var arr_fld_grid = new Array();
					var arr_fld_labels = new Array();
					var fld_sort_name = "";
					var fld_sort_order = "";
					
					for(i=0; i<arr_fields.length; i++)
					{
						if(arr_fields[i].grid != null)
						{
							arr_fld_grid.push(arr_fields[i].grid);
							arr_fld_labels.push(arr_fields[i].label);
							if(arr_fields[i].grid.def_order)
							{
								fld_sort_name = arr_fields[i].grid.name;
								fld_sort_order = arr_fields[i].grid.order;
							}
						}
					}
					
					jQuery("#gridEspecialidades").jqGrid({
					   	url:'<?php echo base_url()."especialidades/listAll"; ?>',
						datatype: "json",
					   	colNames:arr_fld_labels,
					   	colModel:arr_fld_grid,
					   	rowNum:10,
					   	rowList:[5,10,20,30],
					   	height: 'auto',
					   	width:'850',
					   	pager: '#pgridEspecialidades',
					   	sortname: fld_sort_name,
					    viewrecords: true,
					    sortorder: fld_sort_order,
					    caption:"Lista de Especialidades",
					    onSelectRow: function(id){ 
							if(id && id!==editValue){ 
								editValue=id; 
							} 
						}
					})
					.navGrid('#pgridEspecialidades',{edit:false,add:false,del:false,searchtext:"Filtro",refreshtext:"Refresh"},{},{},{},{multipleSearch:true})
					.navSeparatorAdd("#pgridEspecialidades",{sepclass : "ui-separator",sepcontent: ''})
					.navButtonAdd('#pgridEspecialidades',{
								   caption:"Adicionar", 
								   buttonicon:"ui-icon-plus", 
								   onClickButton: function(){ 
										$('#dialog-form').dialog('option', 'title');
							            $('#dialog-form').dialog('open');
										$('#hid_oper').val("add");
								   }
								})
					.navButtonAdd('#pgridEspecialidades',{
								   caption:"Editar", 
								   buttonicon:"ui-icon-pencil", 
								   onClickButton: function(){ 
									   if(editValue != null)
									   {
										$.ajax({
						                        type: "POST",
						                        url: '<?php echo base_url()."especialidades/getById"?>',
						                        data: {id:editValue},
						                        success: function(msg) 
						                        {
													var obj = msg;
													fc_edit(arr_fields, obj);	
													$('#hid_oper').val("upd");
						                        }
											});
											$('#dialog-form').dialog('open');
									   }
									   else
									   {
										   dialogMessage('Selecione uma linha','dialog-message');   
											$("#gridEspecialidades").trigger("reloadGrid");
										}
								   }
								})
					.navButtonAdd('#pgridEspecialidades',{
								   caption:"Excluir", 
								   buttonicon:"ui-icon-trash", 
								   onClickButton: function(){ 
								   		if(editValue != null)
									   	{
								   			$("#dialog-confirm").dialog({
								   				resizable: false,
								   				height:140,
								   				modal: true,
								   				buttons: {
								   					'Confirmar': function() {
														$.ajax({
								                    		type: "POST",
								                    		url: '<?php echo base_url()."especialidades/delete"?>',
								                    		data: {id:editValue},
								                    		success: function(msg) 
								                    		{
														  		var type = msg.substr(0,3);
																var msgs = msg.substr(4);
				
																if(type != "err")
																{
										   							showMsg(msgs);
																}
																else
																{
																	dialogMessage(msgs,'dialog-message');   
																}
										       					$("#gridEspecialidades").trigger("reloadGrid");
										       					editValue = null;
								                    		}
														});
								   						$(this).dialog('close');
								   					},
								   					Cancelar: function() {
								   						$(this).dialog('close');
								   					}
								   				}
								   			}); 
									   	}
								   		else
								   		{
											   dialogMessage('Selecione uma linha','dialog-message');   
												$("#gridEspecialidades").trigger("reloadGrid");
									   	}
								   }
								})
				});

				$(function() {

					var descricao = $("#descricao"),
					flag_ativo = $("#flag_ativo"),
					allFields = $([]).add(descricao).add(flag_ativo),
					tips = $(".validateTips");
							
	    			
				    $("#dialog-form").dialog({
					    bgiframe: true,
					    autoOpen: false,
					    height: 280,
					    width: 400,
					    modal: true,
					    buttons: {
						    'Cancelar': function() {
							    $(this).dialog('close');
					    		fc_reset_form(arr_fields);
						    }, 
						    'Salvar': function()
						    {
								var bValid = true;
								allFields.removeClass('ui-state-error');

								bValid = bValid && validation(descricao, "Descri\u00e7\u00e3o", "required", tips, 0, 0);
								bValid = bValid && validation(descricao, "Descri\u00e7\u00e3o", "length", tips, 1, 250);

								if(bValid)
								{
									eval(fc_get_fields(arr_fields));
									$.ajax({
										  type: 'POST',
										  url: '<?php echo base_url()."especialidades/save"?>',
										  data: arr_data,
										  success: function(msg){
										  		var type = msg.substr(0,3);
												var msgs = msg.substr(4);
										  		if(type != "err")
										  		{
													showMsg(msgs);
													$("#gridEspecialidades").trigger("reloadGrid");
													editValue = null;
										    		fc_reset_form(arr_fields);
													allFields.val('').removeClass('ui-state-error');
										  			document.getElementById('error').innerHTML= "";
										  			document.getElementById("error").style.display='none';
													$("#dialog-form").dialog('close');
										  		}
										  		else
										  		{
										  			document.getElementById('error').innerHTML= msgs;
										  			document.getElementById("error").style.display="";
											  	}
											}
									});
								}
							}
					    },
					    close: function() {				
					    }
				    });
				});		
			</script>
			<br />
			<br />
			<div align="center">
				<table id="gridEspecialidades"></table>
				<div id="pgridEspecialidades"></div>
			</div>
			<div id="dialog-form" title="Formul&aacute;rio de Especialidades">
				<div id="error" class="ui-state-highlight" style="display:none;"></div>
				<p class="validateTips">Todos os campos s&atilde;o obrigat&oacute;rios.</p>
				<form>
					<fieldset>
						<table border="0" cellpadding="0" cellspacing="0" width="100%">
							<tr>
								<td>
									<label for="descricao">Descri&ccedil;&atilde;o</label>
									<br />
									<input type="text" name="descricao" id="descricao" class="text ui-widget-content ui-corner-all" size="40" />
								</td>
							</tr>
							<tr height="10px">
								<td>&nbsp;</td>
							</tr>
							<tr>
								<td>
									<label for="flag_ativo">Especialidade Ativa?</label><br />
									<select name="flag_ativo" id="flag_ativo" class="select ui-widget-content ui-corner-all">
										<option value="S">Sim</option>
										<option value="N">N&atilde;o</option>
									</select>
								</td>
							</tr>
						</table>
					</fieldset>
					<input type="hidden" id="hid_oper" value="" />
					<input type="hidden" id="id" value="" />
				</form>
			</div>
	</div>